<template>
  <div>
    <!-- v-model:进行双向绑定 -->
    用户名:<input v-model="username" type="text">
    <hr>
    密码:<input v-model="password" type="text">
    <hr>
    来自于:<select v-model="city" name="" id="">
      <option value="wh">武汉</option>
      <option value="xn">咸宁</option>
      <option value="xg">孝感</option>
      <option value="jm">荆门</option>
    </select>
    <br>
    爱好<input v-model="hobby" type="checkbox" name="" id="" value="smoke">抽烟
    <input v-model="hobby" type="checkbox" name="" id="" value="drink">喝酒
    <input v-model="hobby" type="checkbox" name="" id="" value="code">写代码
    爱好<input v-model="one" type="checkbox" name="" id="" value="smoke1">抽烟1
    <input v-model="one" type="checkbox" name="" id="" value="drink1">喝酒1
    <input v-model="one" type="checkbox" name="" id="" value="code1">写代码1
    <br>
    性别<input v-model="gander" type="radio" name="gander" value="man" id="">男
    <input v-model="gander" type="radio" name="gander" value="woman" id="">女
    <hr>
    自我介绍
    <textarea name="" id="" cols="30" rows="10" v-model="txt"></textarea>
  </div>
</template>

<script>
export default {
  name: 'CodeApp',
  data() {
    return {
      password:'1234',
      username:'甘甘',
      city:"xn",
      txt:'你妈妈真好看',
      hobby:"",//非数组为布尔值
      one:[],//数组形式获得value值
      gander:[],
    };
  },

  mounted() {
    
  },

  methods: {
    
  },
};
</script>

<style lang="scss" scoped>

</style>